import React from 'react';
import PropTypes from 'prop-types';
import BaseComponent from '../../components/common/baseComponent.js';
import telIcon from '../../../assets/images/cq/user/user-tel-icon.png';
import { SERVICE_TEL, SERVICE_TEL_ESCORT } from '../../constants/setting';
import { callService } from '../../utils/func';

class ServiceTel extends BaseComponent {
  static propTypes = {
    type: PropTypes.oneOf(['escort', 'youyu']),
  }
  static defaultProps = {
    type: 'youyu',
  }

  clickService = () => {
    const { type } = this.props;
    if (type === 'escort') {
      callService('escort');
    } else {
      callService();
    }
  }

  render() {
    const { className, type } = this.props;
    return (
      <div className={`service-tel-footer ${className}`} onClick={this.clickService}>
        <p className="service-text">
          如需帮助 请拨打客服电话
          <br />
          <span className="tel">{type === 'escort' ? SERVICE_TEL_ESCORT : SERVICE_TEL}</span>
          <span className="time">(8:00~22:00)</span>
        </p>
        <img src={telIcon} alt="" className="tel-icon" />
      </div>
    );
  }
}

export default ServiceTel;
